import {App, Button, Card, Checkbox, Form, Input, InputNumber, Space} from 'antd';
import React, {useState} from 'react';
import AdminPageSetting from "type/AdminSetting";
import useAsyncEffect from "hook/useAsyncEffect";
import UserStorage from "storage/local/UserStorage";
import LogFactory from "log/LogFactory";
import RequestHandler from "../../../http/RequestHandler";
import {SecurityMenu} from "../../../type/entity/SecurityMenu";
import {CheckboxOptionType} from "antd/es/checkbox/Group";

const log = LogFactory.getLogger("SettingComponent");

function SettingComponent() {
    const [ loading, setLoading ] = useState<boolean>(false);
    const { message } = App.useApp();
    const [form] = Form.useForm<AdminPageSetting>();
    const [expandOptions, setExpandOptions] = useState<CheckboxOptionType[]>([]);
    useAsyncEffect(async ()=> {
        const pageSetting = await UserStorage.getInstance().getAdminPageConfig();
        form.setFieldsValue(pageSetting);
        log.debug("pageSetting", pageSetting);

        RequestHandler.get<AdminPageSetting>("/manager/admin/setting/" + UserStorage.getInstance().getUsername())
            .then(res => {
                log.debug("服务器用户配置", res);
            });
        // /manager/admin/menu/list/first-level
        RequestHandler.get<SecurityMenu[]>("/manager/admin/menu/list/first-level")
            .then(res => {
                log.debug("获取一级菜单", res.data);
                if (res.success){
                    setExpandOptions(res.data.map(m => ({ label: m.label, value: m.path})));
                }
            });
    });

    const saveToLocal = async () => {
        log.debug("保存配置到本地存储", form.getFieldsValue());
        setLoading(true);
        await UserStorage.getInstance().saveAdminPageConfig(form.getFieldsValue());
        await message.success("配置保存到本地成功");
        setLoading(false);
    };

    const onFinish = async (value: AdminPageSetting) => {
        log.debug("保存用户配置到云端", value);
        setLoading(true);
        await RequestHandler.put<boolean>("/manager/admin/setting", value)
            .then(res => {
                log.debug("保存结果", res);
            });
        message.success("保存配置到服务器成功");
        setLoading(false);
    };

    return (
        <Card title="页面设置" extra={"backup"}>
            <Form<AdminPageSetting>
                form={form}
                wrapperCol={{span: 14}}
                labelCol={{span: 5}}
                onFinish={onFinish}
            >
                <Form.Item<AdminPageSetting> name={"username"} label={"当前用户"}>
                    <Input disabled/>
                </Form.Item>
                <Form.Item<AdminPageSetting> name={"userPageSize"} label={"用户页数量"}>
                    <InputNumber min={0} max={99} addonAfter={"条"}/>
                </Form.Item>
                <Form.Item<AdminPageSetting> name={"rolePageSize"} label={"角色页数量"}>
                    <InputNumber min={0} max={99} addonAfter={"条"}/>
                </Form.Item>
                <Form.Item<AdminPageSetting> name={"menuPageSize"} label={"菜单页数量"}>
                    <InputNumber min={0} max={99} addonAfter={"条"}/>
                </Form.Item>
                <Form.Item<AdminPageSetting> name={"pathPageSize"} label={"路径页数量"}>
                    <InputNumber min={0} max={99} addonAfter={"条"}/>
                </Form.Item>
                <Form.Item name={"defaultSkipUrl"} label={"默认跳转路径"}>
                    <Input/>
                </Form.Item>
                <Form.Item name={"defaultExpand"} label={"默认展开菜单"}>
                    <Checkbox.Group options={expandOptions}/>
                </Form.Item>
                <Form.Item wrapperCol={{offset: 2}}>
                  <Space>
                      <Button loading={loading} type={"primary"} htmlType={"submit"}>
                          保存修改到服务器
                      </Button>
                      <Button loading={loading} style={{backgroundColor: "#0a4e0a"}} type={"primary"} onClick={saveToLocal}>
                          保存修改到本地
                      </Button>
                  </Space>
                </Form.Item>
            </Form>
        </Card>
    );
}

export default SettingComponent;